import 'package:flutter/material.dart';
import 'package:study_online/entity/CourseRou.dart';
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter_screenutil/screen_util.dart';
import 'package:study_online/entity/Course.dart';
import 'package:study_online/entity/MyCourseItem.dart';
import 'package:study_online/global/colors.dart';
import 'package:study_online/pages/studyPage/views/CourseDetailPage.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  const MyApp({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        //appBar: AppBar(
        //  backgroundColor: Colors.black26,
        //  title: Text('container'),
        //),
        body: ListView(
          children: [
            CourseItem(
              index: 0,
            ),
            CourseItem(
              index: 1,
            ),
            CourseItem(
              index: 2,
            ),
            CourseItem(
              index: 4,
            ),
            CourseItem(
              index: 5,
            ),
            CourseItem(
              index: 6,
            ),
          ],
        ),
      ),
    );
  }
}

class CourseItem extends StatelessWidget {
  CourseItem({Key key, this.index, this.course}) : super(key: key);
  int index;
  MyCourseItem course;
  List<String> bglist = [
    'assets/img/course_bg1.png',
    'assets/img/course_bg2.png',
    'assets/img/course_bg3.png'
  ];

  void _startHeroAnimation(BuildContext context) {
    var routeSettings = RouteSettings();
    //携带第一个页面的参数
    var copyWithSettings = routeSettings.copyWith(arguments: index);
    Navigator.push(
      context,
      PageRouteBuilder(
        pageBuilder: (BuildContext context, Animation animation,
            Animation secondaryAnimation) {
          return new FadeTransition(
            opacity: animation,
            child: CourseDetailPage('','',1,1),
          );
        },
        settings: copyWithSettings,
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    ScreenUtil.init(
      BoxConstraints(
          maxWidth: MediaQuery.of(context).size.width,
          maxHeight: MediaQuery.of(context).size.height),
      designSize: Size(1080, 2340),
    );
    //debugPaintSizeEnabled = true;
    return InkWell(
      onTap: () {
        CourseRou courseRou=new CourseRou(course.couId,course.couCover,course.teaName,course.couName);
        print("###1"+courseRou.teacher);
        Navigator.pushNamed(context, 'courseStudy',arguments: [courseRou]);
        //_startHeroAnimation(context);
      },
      child: Stack(
        key:ValueKey(index),
        children: [
          Container(
            width: ScreenUtil().screenWidth - 2 * ScreenUtil().setWidth(52),
            height: ScreenUtil().setHeight(372),
            margin: EdgeInsets.fromLTRB(ScreenUtil().setWidth(52),
                ScreenUtil().setHeight(36), ScreenUtil().setWidth(52), 0),
            // padding: EdgeInsets.fromLTRB(
            //     ScreenUtil().setWidth(32), ScreenUtil().setHeight(10), 0, 0),
            decoration: BoxDecoration(
                borderRadius: BorderRadius.all(Radius.circular(10)),
                boxShadow: [
                  BoxShadow(
                      color: Colors.black26,
                      offset: Offset(0, 3),
                      blurRadius: 1.0,
                      spreadRadius: 0.6,
                  ),
                ],
            ),
            child: ClipRRect(
              borderRadius: BorderRadius.all(Radius.circular(11)),
              child: Image.asset(
                bglist[index % 3],
                width: ScreenUtil().screenWidth - 2 * ScreenUtil().setWidth(52),
                height: ScreenUtil().setHeight(372),
                fit: BoxFit.cover,
              ),
            ),
          ),
          Positioned(
            top: ScreenUtil().setHeight(76),
            left: ScreenUtil().setWidth(88),
            child: Hero(
              tag: "HeroAnimationTag" + index.toString(),
              child: ClipRRect(
                borderRadius: BorderRadius.all(Radius.circular(10)),
                child: Image.network(
                  //'assets/img/course_cover.png',
                  course.couCover,
                  width: ScreenUtil().setWidth(404),
                  height: ScreenUtil().setHeight(280),
                  fit: BoxFit.cover,
                ),
              ),
            ),
          ),
          Positioned(
            top: ScreenUtil().setHeight(92),
            left: ScreenUtil().setWidth(524),
            child: Container(
              height: ScreenUtil().setHeight(272),
              width: ScreenUtil().setWidth(430),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Text(
                    course.couName,
                    style: TextStyle(
                        fontSize: ScreenUtil().setSp(45),
                        color: Colors.black,
                        fontWeight: FontWeight.bold),
                  ),
                  Text(
                    course.teaName,
                    style: TextStyle(
                      fontSize: ScreenUtil().setSp(35),
                      color: Colors.grey,
                    ),
                  ),
                  Container(
                    height: ScreenUtil().setHeight(65),
                    child: Row(
                      children: [
                        Container(
                          width: ScreenUtil().setWidth(230),
                          height: ScreenUtil().setHeight(30),
                          child: ClipRRect(
                            borderRadius: BorderRadius.all(
                                Radius.circular(ScreenUtil().setHeight(15))),
                            child: LinearProgressIndicator(
                              value: course.process / 100,
                              backgroundColor: Colors.white,
                              valueColor: AlwaysStoppedAnimation<Color>(
                                  AppColors.primary),
                            ),
                          ),
                        ),
                        SizedBox(width: ScreenUtil().setWidth(12)),
                        Text(
                          '已学',
                          style: TextStyle(
                            fontSize: ScreenUtil().setSp(35),
                            color: Colors.grey,
                          ),
                        ),
                        SizedBox(width: ScreenUtil().setWidth(8)),
                        Text(
                          '${course.process}%',
                          style: TextStyle(
                            fontSize: ScreenUtil().setSp(40),
                            color: Colors.black38,
                          ),
                        ),
                      ],
                    ),
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Text(
                        '共${course.num}课时',
                        style: TextStyle(
                          fontSize: ScreenUtil().setSp(40),
                          color: Colors.black45,
                        ),
                      ),
                      Row(
                        mainAxisAlignment: MainAxisAlignment.end,
                        children: [
                          Text(
                            course.joinTime.substring(0, 10),
                            style: TextStyle(
                              fontSize: ScreenUtil().setSp(40),
                              color: Colors.black38,
                            ),
                          ),
                        ],
                      )
                    ],
                  )
                ],
              ),
            ),
          ),
          Positioned(
            top: ScreenUtil().setHeight(292),
            left: ScreenUtil().setWidth(89),
            child: Container(
              width: ScreenUtil().setWidth(115),
              height: ScreenUtil().setHeight(60),
              decoration: BoxDecoration(
                color: Colors.black54,
                borderRadius: BorderRadius.only(
                    bottomLeft: Radius.circular(5),
                    topRight: Radius.circular(5)),
              ),
              child: Center(
                child: Text(
                  '必修课',
                  style: TextStyle(
                    fontSize: ScreenUtil().setSp(33),
                    color: Colors.white,
                  ),
                ),
              ),
            ),
          )
        ],
      ),
    );
  }
}
